import { createRouter, createWebHistory } from 'vue-router';
// 导入页面组件 (使用路由懒加载)
const Home = () => import('@/views/HomeView.vue');
const About = () => import('@/views/AboutView.vue');
const NotFound = () => import('@/views/NotFound.vue');
const Product = () => import('@/views/ProductView.vue');
const Service = () => import('@/views/ServiceView.vue');
const MainView = ()=> import('@/views/MainView.vue')
// 定义路由规则
const routes = [
    {
        path: '/',
        name: 'MainView',
        component: MainView,
        meta: {
            requiresAuth: false // 路由元信息示例
        },
        children: [
            {
                path: '/home',
                name: 'Home',
                component: Home
            },
            {
                path: '/about',
                name: 'About',
                component: About
            },
            {
                path: '/product',
                name: 'product',
                component: Product
            },
            {
                path: '/service',
                name: 'service',
                component: Service
            },

            {
                path: '/:pathMatch(.*)*', // 404 路由捕获
                name: 'NotFound',
                component: NotFound
            }

        ]
    },

];
// 创建路由器实例
const router = createRouter({
// 使用 HTML5 历史模式
    history: createWebHistory(),
// 路由规则
    routes,
// 滚动行为
    scrollBehavior(to, from, savedPosition) {
        if (savedPosition) {
            return savedPosition;
        } else {
            return { top: 0 };
        }
    }
});
export default router;